<!DOCTYPE html>
<html>

<head>
	<title>Settings | KeePassHttp-Connector</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link href="bootstrap.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="../bootstrap-btn.css" />
	<link href="bootstrap-theme.min.css" rel="stylesheet" />
	<script type="text/javascript" src="../browser-polyfill.min.js"></script>
	<script type="text/javascript" src="../jquery-3.2.1.min.js"></script>
	<script type="text/javascript" src="bootstrap.min.js"></script>
	<script type="text/javascript" src="options.js"></script>
	<script src="../translate.js" defer></script>
	<style type="text/css">
		body {
			padding-top: 20px;
			padding-bottom: 60px;
		}

		/* Custom container */
		.container {
			margin: 0 auto;
			max-width: 1000px;
		}

		.container>hr {
			margin: 30px 0;
		}

		.tab {
			display: none;
		}

		h2+hr {
			margin-top: 0;
		}

		#tab-connected-databases .color.dropdown .dropdown-menu {
			width: 180px;
			padding: 7px 10px;
			line-height: 175%;
		}

		#tab-connected-databases .color.dropdown .dropdown-menu a {
			margin-right: 3px;
		}

		#tab-connected-databases .color.dropdown a.dropdown-toggle img {
			margin-right: 5px;
		}

		tr.clone {
			display: none;
		}

		td.last-used,
		td.created {
			white-space: nowrap;
		}

		.bold {
			font-weight: bold;
		}

		.radio.inline,
		.checkbox.inline {
			display: inline-block;
			white-space: nowrap;
		}

		.radio.inline+.radio.inline,
		.checkbox.inline+.checkbox.inline {
			margin-left: 40px;
		}

		.checkUpdateKeePassHttp {
			margin-left: 40px;
		}

		#dangerousSettings {
			display: none;
		}
	</style>
</head>

<body>
	<div class="container">
		<div class="masthead">
			<h3 class="muted"><img src="/icons/keepass_48x48.png" alt="logo" /> KeePassHttp-Connector-Edge</h3>
			<div class="navbar">
				<div class="navbar-inner">
					<div class="container">
						<ul class="nav nav-pills nav-justified">
							<li class="active"><a href="#general-settings"><span data-i18n="title1"></span></a></li>
							<li><a href="#connected-databases"><span data-i18n="title2"></span></a></li>
							<li><a href="#specified-fields"><span data-i18n="title3"></span></a></li>
							<li><a href="#about"><span data-i18n="title4"></span></a></li>
						</ul>
					</div>
				</div>
			</div><!-- /.navbar -->
		</div>

		<!-- General Settings -->
		<!-- 常规设置 -->
		<div class="tab" id="tab-general-settings">
			<h2><span data-i18n="title1_1"></h2>
			<hr />
			<p>
				<span data-i18n="hotKeyDes1"></span>
				<br />
				<span data-i18n="hotKeyDes2"></span>	
			</p>
			<p>
				<label for="blinkTimeout"><span data-i18n="blinktime"></span></label>
			<div class="control-group">
				<div class="input-append">
					<input type="number" id="blinkTimeout" placeholder="7500" value="7500" />
					<button class="btn" id="blinkTimeoutButton" type="button"><span data-i18n="save"></span></button>
				</div>
				<span class="help-inline" data-i18n="blinktimeDes"></span>
			</div>
			</p>
			<p>
				<label for="blinkMinTimeout"><span data-i18n="redirectOffset"></span></label>
			<div class="control-group">
				<div class="input-append">
					<input type="number" id="blinkMinTimeout" placeholder="2000" value="2000" />
					<button class="btn" id="blinkMinTimeoutButton" type="button"><span data-i18n="save"></span></button>
				</div>
				<span class="help-inline" data-i18n="redirectOffsetDes"></span>
			</div>
			</p>
			<p>
				<label for="allowedRedirect"><span data-i18n="redirectAllowance"></span></label>
			<div class="control-group">
				<div class="input-append">
					<input type="number" id="allowedRedirect" placeholder="1" value="1" />
					<button class="btn" id="allowedRedirectButton" type="button"><span data-i18n="save"></span></button>
				</div>
				<span class="help-inline" data-i18n="redirectAllowanceHelp"></span>
			</div>
			</p>
			<hr />
			<p>
				<label class="checkbox">
					<input type="checkbox" name="usePasswordGenerator" />
					<span data-i18n="activatePasswordGenerator"></span>
				</label>
				<span class="help-block" data-i18n="activatePasswordGeneratorHelp"></span>
			</p>
			<hr />
			<p>
				<label class="checkbox">
					<input type="checkbox" name="autoRetrieveCredentials" />
					<span data-i18n="automaticallyRetrieveCredentials"></span>
				</label>
				<span class="help-block" data-i18n="automaticallyRetrieveCredentialsHelp"></span>
			</p>
			<hr />
			<p>
				<label class="checkbox">
					<input type="checkbox" name="autoFillSingleEntry" />
					<span data-i18n="automaticallyFillInSingleCredentialsEntry"></span>
				</label>
				<span class="help-block" data-i18n="automaticallyFillInSingleCredentialsEntryHelp"></span>
			</p>
			<hr />
			<p>
				<label class="checkbox">
					<input type="checkbox" name="autoCompleteUsernames" />
					<span data-i18n="activateAutocompleteForUsernameFields"></span>
				</label>
				<span class="help-block" data-i18n="activateAutocompleteForUsernameFieldsHelp"></span>
			</p>
			<hr />
			<p>
				<span data-i18n="CheckForUpdates"></span>
				<br />
				<label class="radio inline"><input type="radio" name="checkUpdateKeePassHttp" value="3" />
					<span data-i18n="updateFrequency1"></span>
				</label>
				<label class="radio inline"><input type="radio" name="checkUpdateKeePassHttp" value="7" />
					<span data-i18n="updateFrequency2"></span>
				</label>
				<label class="radio inline"><input type="radio" name="checkUpdateKeePassHttp" value="30" />
					<span data-i18n="updateFrequency3"></span>
				</label>
				<label class="radio inline"><input type="radio" name="checkUpdateKeePassHttp" value="0" />
					<span data-i18n="updateFrequency4"></span>
				</label>
			</p>
			<div class="help-block kphVersion">
				<span data-i18n="versionUpdateDes"></span>
				<div class="row">
					<div class="span3"><span data-i18n="yourVersion"></span></div>
					<div class="span6"><em class="yourVersion"></em></div>
				</div>
				<div class="row">
					<div class="span3">
						<span data-i18n="latestVersion"></span>
					</div>
					<div class="span6"><em class="latestVersion"></em>
						<button class="btn btn-mini checkUpdateKeePassHttp">
							<span data-i18n="CheckForUpdatesButton"></span>
						</button>
					</div>
				</div>
			</div>
			<hr />
			<p id="http-auth-options">
				<label class="checkbox">
					<input type="checkbox" name="autoFillAndSend" />
					<span data-i18n="autoFillHttp"></span>
				</label>
				<span class="help-block" data-i18n="autoFillHttpHelp"></span>
				<img src="/options/http-auth-dialog.png" alt="http-auth-dialog" />
			</p>
			<hr />
			<div class="alert alert-error">
				<span data-i18n="attention"></span>
			</div>
			<button id="showDangerousSettings" class="btn btn-danger" style="width: 203px; height: 30px;">
				<span data-i18n="showSetting"></span>
			</button>
			<div id="dangerousSettings">
				<br />
				<p>
					<span data-i18n="dangerousSettingsDes"></span>
				</p>
				<p>
					<label for="hostname"><span data-i18n="hostname"></span></label>
				<div class="control-group">
					<div class="input-append">
						<input type="text" id="hostname" placeholder="localhost" value="localhost" />
						<button class="btn" id="hostnameButton" type="button"><span data-i18n="save"></span></button>
					</div>
					<span class="help-inline" data-i18n="defaultHost"></span>
				</div>
				</p>
				<p>
					<label for="port"><span data-i18n="port"></span></label>
				<div class="control-group">
					<div class="input-append">
						<input type="number" id="port" placeholder="19455" value="19455" />
						<button class="btn" id="portButton" type="button"><span data-i18n="save"></span></button>
					</div>
					<span class="help-inline" data-i18n="protHelpDes"></span>
				</div>
				</p>
				<p>
					<label class="checkbox">
						<input type="checkbox" name="supressAlerts" />
						<span data-i18n="supressAlerts"></span>
					</label>
					<span class="help-block" data-i18n="supressAlertsDes"></span>
				</p>
				<p hidden=true>
					<label class="checkbox">
						<input type="checkbox" name="respectMaxLength" /> <span data-i18n="respectMaxlength"></span>
					</label>
					<span class="help-block" data-i18n="respectMaxlengthHelp"> </span>
				</p>
			</div>
		</div>

		<!-- Connected Databases -->
		<!-- 链接数据库 -->
		<div class="tab" id="tab-connected-databases">
			<h2><span data-i18n="title2"></h2>
			<hr />
			<p>
				<span data-i18n="connectDatabaseDes"></span>
			</p>
			<table class="table table-striped table-bordered table-hover">
				<thead>
					<tr>
						<th class="span5"><span data-i18n="identifier"></span></th>
						<th class="span2"><span data-i18n="icon"></span></th>
						<th class="span2"><span data-i18n="lastUsed"></span></th>
						<th class="span2"><span data-i18n="created"></span></th>
						<th class="span1"><span data-i18n="delete"></span></th>
					</tr>
				</thead>
				<tbody>
					<tr class="empty">
						<td colspan="5"><span data-i18n="noConnect"></span></td>
					</tr>
					<tr class="clone">
						<td></td>
						<td>
							<div class="dropdown color">
								<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
									<img src="/icons/19x19/icon_normal_blue_19x19.png" alt="" />
									<span class="caret"></span>
								</a>
								<div class="dropdown-menu">
									<a href="#blue"><img src="/icons/19x19/icon_normal_blue_19x19.png" alt="" /></a>
									<a href="#purple"><img src="/icons/19x19/icon_normal_purple_19x19.png" alt="" /></a>
									<a href="#green"><img src="/icons/19x19/icon_normal_green_19x19.png" alt="" /></a>
									<a href="#red"><img src="/icons/19x19/icon_normal_red_19x19.png" alt="" /></a>
									<a href="#yellow"><img src="/icons/19x19/icon_normal_yellow_19x19.png" alt="" /></a>
									<a href="#aqua"><img src="/icons/19x19/icon_normal_aqua_19x19.png" alt="" /></a>
									<a href="#orange"><img src="/icons/19x19/icon_normal_orange_19x19.png" alt="" /></a>
									<a href="#pink"><img src="/icons/19x19/icon_normal_pink_19x19.png" alt="" /></a>
									<a href="#grey"><img src="/icons/19x19/icon_normal_grey_19x19.png" alt="" /></a>
									<a href="#blue-inverse"><img src="/icons/19x19/icon_normal_blue-inverse_19x19.png"
											alt="" /></a>
									<a href="#purple-inverse"><img
											src="/icons/19x19/icon_normal_purple-inverse_19x19.png" alt="" /></a>
									<a href="#green-inverse"><img src="/icons/19x19/icon_normal_green-inverse_19x19.png"
											alt="" /></a>
									<a href="#red-inverse"><img src="/icons/19x19/icon_normal_red-inverse_19x19.png"
											alt="" /></a>
									<a href="#yellow-inverse"><img
											src="/icons/19x19/icon_normal_yellow-inverse_19x19.png" alt="" /></a>
									<a href="#aqua-inverse"><img src="/icons/19x19/icon_normal_aqua-inverse_19x19.png"
											alt="" /></a>
									<a href="#orange-inverse"><img
											src="/icons/19x19/icon_normal_orange-inverse_19x19.png" alt="" /></a>
									<a href="#pink-inverse"><img src="/icons/19x19/icon_normal_pink-inverse_19x19.png"
											alt="" /></a>
									<a href="#grey-inverse"><img src="/icons/19x19/icon_normal_grey-inverse_19x19.png"
											alt="" /></a>
								</div>
							</div>
						</td>
						<td class="last-used"></td>
						<td class="created"></td>
						<td><button class="btn delete btn-danger"><span data-i18n="remove"></span></button></td>
					</tr>
				</tbody>
			</table>
			<div style="text-align: right">
				<button id="connect-button" class="b2c-btn b2c-btn-primary"><span data-i18n="connect"></span></button>
			</div>
			<div id="dialogDeleteConnectedDatabase" class="modal" style="display:none;" tabindex="-1" role="dialog">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
							<h3 id="myModalLabel"><span data-i18n="">removeDes</span></h3>
						</div>
						<div class="modal-body">
							<p><span data-i18n="removeNotice"></span></p>
							<p class="help-block"><span data-i18n="removeNotice1"></span></p>
						</div>
						<div class="modal-footer">
							<button class="btn" data-dismiss="modal" aria-hidden="true"><span
									data-i18n="cancel"></span></button>
							<button class="btn yes btn-primary"><span data-i18n="yes"></span></button>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- Specified credential fields -->
		<div class="tab" id="tab-specified-fields">
			<h2><span data-i18n="title3"></h2>
			<hr />
			<p>
				<span data-i18n="specifiedDes"></span>
			</p>
			<table class="table table-striped table-bordered table-hover">
				<thead>
					<tr>
						<th class="span10"><span data-i18n="pageUrl"></span></th>
						<th class="span2"><span data-i18n="delete"></span></th>
					</tr>
				</thead>
				<tbody>
					<tr class="empty">
						<td colspan="2"><span data-i18n="noSpecified"></span></td>
					</tr>
					<tr class="clone">
						<td></td>
						<td><button class="btn delete btn-danger btn"><span data-i18n="remove"></span></button></td>
					</tr>
				</tbody>
			</table>
			<div id="dialogDeleteSpecifiedCredentialFields" class="modal" style="display:none;" tabindex="-1"
				role="dialog">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
							<h3 id="myModalLabel"><span data-i18n="removeDes1"></span></h3>
						</div>
						<div class="modal-body">
							<p><span data-i18n="removeNotice2"></span></p>
							<p class="help-block"><span data-i18n="removeNotice3"></span></p>
						</div>
						<div class="modal-footer">
							<button class="btn" data-dismiss="modal" aria-hidden="true"><span
									data-i18n="cancel"></span></button>
							<button class="btn yes btn-primary"><span data-i18n="yes"></span></button>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- About -->
		<!-- 关于 -->
		<div class="tab" id="tab-about">
			<h2><span data-i18n="title4"></h2>
			<hr />
			<p>
				<span data-i18n="help1"></span>
			</p>
			<p hidden="true">
				<a target="_blank"
					href="https://chrome.google.com/webstore/detail/keepasshttp-connector/dafgdjggglmmknipkhngniifhplpcldb"
					id="chrome-web-store-link"><span data-i18n="visit1"></span></a>
			</p>
			<p>
				<a target="_blank"
					href="https://microsoftedge.microsoft.com/addons/detail/bjfplpjakcjndfljopfdmmcankpopdki"
					id="edge-web-store-link"><span data-i18n="visit2"></span></a>
			</p>
			<p>
				<a target="_blank" href="https://github.com/wodx521/keepasshttp-connector"><span
						data-i18n="visit3"></span></a>
			</p>
			<hr />
			<div class="row">
				<div class="span3"><span data-i18n="keepasshttpConnectorVersion"></span></div>
				<div class="span6"><em class="versionCIP"></em></div>
			</div>
			<div class="row">
				<div class="span3"><span data-i18n="keepasshttpVersion"></span></div>
				<div class="span6"><em class="versionKPH"></em></div>
			</div>
		</div>
		<hr>
		<div class="footer">
			<p>2010-2017 - Perry Nguyen, Lukas Schulze</p>
		</div>
	</div> <!-- /container -->
</body>

</html>